\section{jQuery案例}

\subsection{回到顶部}
原理：scroll()事件触发后，判断位置，根据位置显示或隐藏按钮，点击后通过设置scrollTop()方法达到返回顶部的效果。

\begin{lstlisting}
$(function() {
    var b = $('#toTop');
    $(window).scroll(function() {
        100 < $(this).scrollTop() ? b.fadeIn() : b.fadeOut()
    });
    b.click(function(e) {
            e.preventDefault();
            $("body, html").animate({
                scrollTop: 0
            }, 1000);
        })
});
\end{lstlisting}

其中用到了window对象的scroll事件，另外有一个小细节，当图片被点击后，使用事件对象的preventDefault()方法阻止了超级链接的默认行为。

\subsection{图片轮播}
原理：先将图片通过改变定位方式隐藏起来，然后通过setInterval()方法改变z-index属性，使之显示出来。

\lstinputlisting{example/jQuery/slide.html}
